{extend name="public/common"}
{block name="body"}
<div class="page-container  dataTables_wrapper">
    <div id="tab-system" class="HuiTab">
        <div class="tabCon">
            <div class="mt-20">
                <table class="table table-border table-bordered table-bg table-hover table-sort table-responsive">
                    <thead>
                    <tr class="text-c">
                        <th><input type="checkbox" class="all_select"></th>
                        <th>会员名称</th>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="$query" id="item"}
                    <tr class="text-c">
                        <td><input type="checkbox" value="{$item.id}" class="single_class_{$item.id}"{if(in_array($item.id,$select))} checked {/if}></td>
                        <td>{$item.username}</td>
                    </tr>
                    {/volist}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="dataTables_paginate paging_simple_numbers" style="width:100%;">
        <span style="float:right;margin-left:-2px;">总共{$query->lastPage()}页  当前第{$query->currentPage()}页 ，共{$query->total()}条</span>
        <div style="float:left;">{$query->render()}</div>
    </div>
</div>
{/block}

{block name="js"}
<script type="text/javascript">
    $(function() {
        $('.skin-minimal input').iCheck({
            checkboxClass : 'icheckbox-blue',
            radioClass : 'iradio-blue',
            increaseArea : '20%'
        });
        $("#tab-system").Huitab({
            index : 0
        });
    });
    var on_attr = new Array();
    var off_attr = new Array();
    var original_arr = new Array();

    var original_str = '{$original}';

    if( ''!=original_str ){
        original_arr = original_str.split(',');
    }
    parent.$('#memberid').val(original_str);
    parent.$('#xz').html(original_arr.length);
    $('.all_select').click(function(){
        if($(this).is(':checked')){
            $('input[class^="single_class_"]').each(function(){
                if( -1==original_arr.indexOf($(this).val()) ){
                    original_arr.push($(this).val());
                }
            });
        }else{
            $('input[class^="single_class_"]').each(function(){
                var index = original_arr.indexOf($(this).val());
                console.error(index);
                if( index>-1 ){
                    original_arr.splice(index, 1);
                }
            });
        }
        parent.$('#memberid').val(original_arr.join(','));
        parent.$('#xz').html(original_arr.length);
    });
    $('input[class^="single_class_"]').click(function(){
        if($(this).is(':checked')){

            if( -1==original_arr.indexOf($(this).val()) ){
                original_arr.push($(this).val());
            }
        }else {
            var index = original_arr.indexOf($(this).val());
            if( index>-1 ){
                original_arr.splice(index, 1);
            }
        }
        parent.$('#memberid').val(original_arr.join(','));
        parent.$('#xz').html(original_arr.length);
    });
    $('.paginate_button').click(function(){
        $('input[class^="single_class_"]').each(function(){
            if( $(this).is(':checked') ){
                on_attr.push($(this).val());
            }else{
                off_attr.push($(this).val());
            }
        });
        var href = $(this).attr('href');
        if( href ){
            $(this).attr('href',href+"&add="+on_attr.toString()+"&remove="+off_attr.toString());
        }
    });

</script>

{/block}
